<template>
  <div class="content">
    <router-view></router-view>
  </div>
  <van-tabbar v-model="active" route>
    <van-tabbar-item name="/tabbar/home" to="/tabbar/home" icon="home-o">首页</van-tabbar-item>
    <van-tabbar-item name="/tabbar/state" to="/tabbar/state" icon="search">动态</van-tabbar-item>
    <van-tabbar-item icon="add" class="red" name="/add" @click="add"></van-tabbar-item>
    <van-tabbar-item name="/tabbar/shop" to="/tabbar/shop" icon="setting-o">会员购</van-tabbar-item>
    <van-tabbar-item name="/tabbar/my" to="/tabbar/my" icon="setting-o">我的</van-tabbar-item>
  </van-tabbar>
</template>

<script setup>
import { ref } from 'vue';
import { useRouter } from 'vue-router';
const router = useRouter()
const active = ref('/tabber/home')
const add = () =>{
  if(window.localStorage.getItem('token')?.length >0){
    router.push('/add')
  }
  else{
    router.push('/login')
  }
}

</script>

<style lang="less" scoped>

.content {
  height: 100%;
  margin-bottom: 1.4rem;
}
.red{
  color: #f71792fb;
}
</style>